﻿<div class="WAll">
	<div class="ToolBar TabBar TabsFixed TabBarLabels">
		<ul class="ToolBarInner">
			<li data-tab="#tab1" class="TabLink active"> <span class="TabBarLabel"><img class="Icon" src="images/svg/iconfont-home.svg" alt="主页"/></span> 主页</li>
			<li data-tab="#tab2" class="TabLink"> <span class="TabBarLabel"><img class="Icon" src="images/svg/iconfont-message.svg" alt="消息"/></span>消息</li>
			<li data-tab="#tab3" class="TabLink"><span class="TabBarLabel"><img class="Icon" src="images/svg/iconfont-picfill.svg" alt="图片"/></span>图片</li>
			<li data-tab="#tab4" class="TabLink"><span class="TabBarLabel"><img class="Icon" src="images/svg/iconfont-shoucang.svg" alt="收藏"/></span>收藏</li>
		</ul>
	</div>
	<div class="TabsCon">
		<div class="Tabs">
			<div id="tab1" class="Tab PT active">
				<ul class="Row NoGutter StyleBox">
					<li class="Col33">
						<a href="JavaScript:;">
							<span class="Pic"><img class="Icon" src="images/svg/iconfont-home.svg"></span>
							<div class="Title">首页</div>
						</a>
					</li>
					<li class="Col33">
						<a href="JavaScript:;">
							<span class="Pic"><img class="Icon" src="images/svg/iconfont-noread.svg"><span class="Badge BadgeDanger">5</span></span>
							<div class="Title">邮件</div>
						</a>
					</li>
					<li class="Col33">
						<a href="JavaScript:;">
							<span class="Pic"><img class="Icon" src="images/svg/iconfont-message.svg"><span class="Badge BadgeDanger">5</span></span>
							<div class="Title">消息</div>
						</a>
					</li>
					<li class="Col33">
						<a href="JavaScript:;">
							<span class="Pic"><img class="Icon" src="images/svg/iconfont-position-o.svg"></span>
							<div class="Title">位置</div>
						</a>
					</li>
					<li class="Col33">
						<a href="JavaScript:;">
							<span class="Pic"><img class="Icon" src="images/svg/iconfont-search.svg"></span>
							<div class="Title">搜索</div>
						</a>
					</li>
					<li class="Col33">
						<a href="JavaScript:;">
							<span class="Pic"><img class="Icon" src="images/svg/iconfont-call.svg"></span>
							<div class="Title">电话</div>
						</a>
					</li>
					<li class="Col33">
						<a href="JavaScript:;">
							<span class="Pic"><img class="Icon" src="images/svg/iconfont-dianhuaben.svg"></span>
							<div class="Title">通讯录</div>
						</a>
					</li>
					<li class="Col33">
						<a href="JavaScript:;">
							<span class="Pic"><img class="Icon" src="images/svg/iconfont-setup.svg"></span>
							<div class="Title">设置</div>
						</a>
					</li>
					<li class="Col33">
						<a href="JavaScript:;">
							<span class="Pic"><img class="Icon" src="images/svg/iconfont-gengduo.svg"></span>
							<div class="Title">更多</div>
						</a>
					</li>
				</ul>
			</div>
			<div id="tab2" class="Tab PT">
				<ul class="ListBlock">
					<li class="ListItem">
						<div class="ItemLink ItemCon InkRipple">
							<div class="ItemMedia">
								<img class="Icon" src="images/svg/iconfont-user.svg" alt="用户">
							</div>
							<div class="ItemInner">
								<div class="ItemTitle">
								Ivan Petrov
								</div>
								<div class="ItemAfter">
								CEO
								</div>
							</div>
						</div>
					</li>
					<li class="ListItem">
						<div class="ItemLink ItemCon InkRipple">
							<div class="ItemMedia">
								<img class="Icon" src="images/svg/iconfont-user.svg" alt="用户">
							</div>
							<div class="ItemInner">
								<div class="ItemTitle">
								John Doe
								</div>
								<div class="ItemAfter">
								<span class="Badge BadgeSuccess">13</span>
								</div>
							</div>
						</div>
					</li>
					<li class="ListItem">
						<div class="ItemLink ItemCon InkRipple">
							<div class="ItemMedia">
								<img class="Icon" src="images/svg/iconfont-user.svg" alt="用户">
							</div>
							<div class="ItemInner">
								<div class="ItemTitle">
								Jenna Smith
								</div>
							</div>
						</div>
					</li>
				</ul>
			</div>
			<div id="tab3" class="Tab PAll">
			
				<div class="ContentBlockInner">
				  <p>图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述。</p>
				  <p> <img data-src="images/01.jpg" width="100%" height="auto" class="Lazy LazyFadeIn "/></p>
				  <p>图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述。</p>
				  <p> <img data-src="images/03.jpg" width="100%" height="auto" class="Lazy LazyFadeIn "/></p>
				  <p>图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述。</p>
				  <p> <img data-src="images/01.jpg" width="100%" height="auto" class="Lazy LazyFadeIn "/></p>
				  <p>图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述。</p>
				  <p> <img data-src="images/02.jpg" width="100%" height="auto" class="Lazy LazyFadeIn "/></p>
				  <p>图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述。</p>
				  <p> <img data-src="images/03.jpg" width="100%" height="auto" class="Lazy LazyFadeIn "/></p>
				  <p>图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述。</p>
				  <p> <img data-src="images/02.jpg" width="100%" height="auto" class="Lazy LazyFadeIn "/></p>
				  <p>图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述。</p>
				  <p> <img data-src="images/01.jpg" width="100%" height="auto" class="Lazy LazyFadeIn "/></p>
				  <p>图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述。</p>
				  <p> <img data-src="images/03.jpg" width="100%" height="auto" class="Lazy LazyFadeIn "/></p>
				  <p>图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述图片文本描述。</p>
				</div>
      
			
			
			</div>
			<div id="tab4" class="Tab PAll">
				<ul class="ListBlock">
					<li class="ListItem">
						<div class="ItemLink ItemCon InkRipple">
							<div class="ItemMedia">
								<img class="Icon" src="images/svg/iconfont-user.svg" alt="用户">
							</div>
							<div class="ItemInner">
								<div class="ItemTitle">
								Ivan Petrov
								</div>
								<div class="ItemAfter">
								CEO
								</div>
							</div>
						</div>
					</li>
					<li class="ListItem">
						<div class="ItemLink ItemCon InkRipple">
							<div class="ItemMedia">
								<img class="Icon" src="images/svg/iconfont-user.svg" alt="用户">
							</div>
							<div class="ItemInner">
								<div class="ItemTitle">
								John Doe
								</div>
								<div class="ItemAfter">
								<span class="Badge BadgeSuccess">13</span>
								</div>
							</div>
						</div>
					</li>
					<li class="ListItem">
						<div class="ItemLink ItemCon InkRipple">
							<div class="ItemMedia">
								<img class="Icon" src="images/svg/iconfont-user.svg" alt="用户">
							</div>
							<div class="ItemInner">
								<div class="ItemTitle">
								Jenna Smith
								</div>
							</div>
						</div>
					</li>
				</ul>
			</div>
		</div>
	</div>
</div>




















